<template>
	<view class="site">
		<nav-bar class="header" title="设备管理" @goBack="goBack">
			<img slot="screen" src="../../../static/img/sx.png" alt="" @click="screen">
		</nav-bar>
		<view>
			<!-- 搜索 -->
			<view class="patrol-search">
				<van-search readonly v-model="searchValue" left-icon="" right-icon="search" placeholder="请输入"
					@click="showSearch=true" @cancel="onSearch('')" />
			</view>
			<view v-if="list.length > 0">
				<van-pull-refresh v-model="refreshing" @refresh="onRefresh">
					<van-list v-model="isLoading" :finished="finished" finished-text="没有更多了" @load="loadMore">
						<!-- 列表页 -->
						<standingCell @acquireId='acquireId' :list='list'>
							<img slot="icon" src="../../../static/img/equipment.png" alt="" v-if='deviceFlag == 1'
								style="width: 25px;height: 25px;">
							<img slot="icon" src="../../../static/img/powerSupply.png" alt="" v-if='deviceFlag == 2'
								style="width: 25px;height: 25px;">
						</standingCell>
					</van-list>
				</van-pull-refresh>
			</view>
			<view v-else class="site-other">
				— — 暂无数据，请选择其他类型查看 — —
			</view>
		</view>

		<!--弹出搜索页-->
		<van-popup v-model="showSearch" position="right">
			<search-equ-match @cancel="showSearch = false;" @search="onSearch" />
		</van-popup>
		<!--筛选弹窗-->
		<!-- @addEquipmentType='addEquipmentType' -->
		<screenPopup :type-list="filtrationList" :single-list='singleList' :showScreen="showScreen"
			@closePopup="showScreen=false" :deviceFlag='deviceFlag' :multipleChoice='true' @confirm="confirmCondition">
		</screenPopup>
	</view>
</template>

<script>
	import navBar from "../../../components/common/nav-bar.vue";
	import screenPopup from "../common/screenPopup1.vue";
	import plateTitle from "../../../components/business/plateTitle.vue";
	import searchEquMatch from '../../common/searchEquMatch';
	import standingCell from "../../../components/standingBookComponents/cell/cell.vue"
	import {
		getdeviceOverall,
		getOption,
		getOtherOption
	} from "../../../api/ydtzApi.js"
	export default {
		data() {
			return {
				showSearch: false,
				showScreen: false,
				refreshing: false, // 是否正在刷新
				finished: false,
				isLoading: false,
				total: 0, // 总条数
				page: 1,
				limit: 10,
				searchValue: '', //搜索
				showSelectContent: false, //筛选弹窗
				list: [],
				deviceFlag: 1,
				deviceFlag: 1,
				manufacturers: [],
				equLevels: [],
				siteTypes: [],
				modelNumbers: [],
				siteid: null,
				siteFilter: null,
				singleList: [],
				filtrationList: [{
					name: '站点类型',
					type: 3,
					child: [{
						TITLE: '全部',
						VALUE: 1,
						isActive: true
					}, ]
				}, ],
			}
		},
		components: {
			navBar,
			searchEquMatch,
			standingCell,
			screenPopup,
			plateTitle
		},
		onLoad(option) {
			this.siteFilter = option.siteFilter
			this.siteid = option.siteid
			this.deviceFlag = option.deviceFlag
			this.getTaskListByAdminT(option)
			this.getOption()
			if (!option.siteFilter) {
				this.getOtherOption(this.deviceFlag)
			}
		},
		methods: {
			// 公共选项
			getOption() {
				let manufacturerFlag = null
				if (this.deviceFlag == 1) {
					manufacturerFlag = 1
				} else if (this.deviceFlag == 2) {
					manufacturerFlag = 2
				} else if (this.deviceFlag == 3) {
					manufacturerFlag = 5
				}
				this.$apiRequest.ydtzApi.getOption({
					dictFlag: 2
				}).then(({
					data: res
				}) => {
					let arr = res
					arr.unshift({
						dictCode: -1,
						dictLabel: "全部",
						default: false
					})
					this.filtrationList[0].child = arr
				})
				// 设备类型
				if (this.siteFilter == "true") {
					this.$apiRequest.ydtzApi.getOption({
						dictFlag: 7
					}).then(({
						data: res
					}) => {
						let arr = res
						arr.unshift({
							dictCode: -1,
							dictLabel: "全部",
							default: false
						})
						this.singleList.push({
							name: '设备类型',
							type: 1,
							child: arr
						})
					})
				} else {
					this.$apiRequest.ydtzApi.getOption({
						dictFlag: 5,
						manufacturerFlag
					}).then(({
						data: res
					}) => {
						let arr = res
						arr.unshift({
							dictCode: -1,
							dictLabel: "全部",
							default: false
						})
						this.filtrationList.push({
							name: '设备品牌',
							type: 5,
							child: arr
						})
					})
				}
			},
			getOtherOption(value) {
				let dictFlag = null
				if (value == 1) {
					dictFlag = 1
				} else if (value == 2) {
					dictFlag = 2
				} else if (value == 3) {
					dictFlag = 3
				}
				this.$apiRequest.ydtzApi.getOtherOption({
					dictFlag
				}).then(({
					data: res
				}) => {
					let arr = res
					arr.unshift({
						dictCode: -1,
						dictLabel: "全部",
						default: false
					})
					this.filtrationList.push({
						name: '设备归属',
						type: 2,
						child: arr
					})
				})
			},
			// 获取列表
			getTaskListByAdminT() {
				console.log(this.deviceFlag, 'deviceFlag')
				let params = {
					pageSize: this.limit,
					pageNum: this.page,
					deviceFlag: this.deviceFlag,
					name: this.searchValue,
					siteid: this.siteid
				}
				if (this.manufacturers.length > 0) {
					params.manufacturers = this.manufacturers
				}
				if (this.equLevels.length > 0) {
					params.equLevels = this.equLevels
				}
				if (this.siteTypes.length > 0) {
					params.siteTypes = this.siteTypes
				}
				if (this.modelNumbers.length > 0) {
					params.modelNumbers = this.modelNumbers
				}
				this.$apiRequest.ydtzApi.getdeviceOverall(params)
					.then(({
						data: res
					}) => {
						this.list = this.list.concat(res.rows.map(item => {
							return {
								name: item.name,
								secondArr: [{
										label: "设备类型",
										value: item.techTypeName,
									},
									{
										label: "所属站点",
										value: item.siteName
									},
									{
										label: "所属厂家",
										value: item.producerName
									},
									{
										label: "投运日期",
										value: item.begTim
									},
								],
								...item
							}
						}));
						this.isLoading = false;
						this.refreshing = false;
						this.total = res.total
					})
			},
			confirmCondition(selected, selected1) {
				if (selected[5] && selected[5].indexOf(-1) == -1) {
					this.manufacturers = selected[5]
				} else {
					this.manufacturers = []
				};
				if (selected[2] && selected[2].indexOf(-1) == -1) {
					this.equLevels = selected[2]
				} else {
					this.equLevels = []
				}
				if (selected[3] && selected[3].indexOf(-1) == -1) {
					this.siteTypes = selected[3]
				} else {
					this.siteTypes = []
				}
				if (selected[4] && selected[4].indexOf(-1) == -1) {
					this.modelNumbers = selected[4]
				} else {
					this.modelNumbers = []
				}
				if (selected1['1'] !== -1 && selected1['1'] && this.siteFilter) {
					this.deviceFlag = selected1['1']
				} else if (this.siteFilter) {
					this.deviceFlag = ""
				}
				this.onRefresh()
			},
			onRefresh() {
				this.refreshing = true;
				this.finished = false;
				this.page = 1;
				this.list = [];
				this.getTaskListByAdminT();
			},
			loadMore() {
				if (this.total > this.list.length) {
					this.page = this.page + 1;
					this.getTaskListByAdminT();
				} else {
					this.finished = true;
				}
			},
			goBack() {
				uni.navigateBack()
			},
			screen() {
				this.showScreen = true;
			},
			onSearch(searchValue) {
				this.searchValue = searchValue
				this.onRefresh()
				this.showSearch = false
			},
			// 获取id进入详情页
			acquireId(value) {
				uni.navigateTo({
					url: `/pages/standingBook/transmissionEquipment/transmissionEquipmentDetail/transmissionEquipmentDetail?objId=${value.objId}&deviceFlag=${value.deviceFlag}&distinguishId=${value.deviceFlag}`
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #f2f6fa;
	}

	.header {
		position: sticky;
		top: 0;
		z-index: 999;

		img {
			width: px2vw(48);
			margin-right: px2vw(40);
		}
	}

	.patrol-search {
		width: px2vw(1020);
		height: 38px;
		margin: px2vw(20) px2vw(30) 0 px2vw(30);

		.van-search {
			padding: 0 0;
			height: 38px;
			border-radius: px2vw(20) !important;
		}

		.van-search__content {
			background: #fff;
			height: 38px;
			border-radius: px2vw(20) !important;
		}

		/deep/.van-field__control {
			height: 30px;
		}
	}

	.site-other {
		position: absolute;
		top: 22%;
		width: 100vw;
		text-align: center;
		font-size: px2vh(36);
		color: #9B9CAA;
		font-weight: 600;
	}
	/deep/ .cell-line-item {
		width: 50%;
	}
	
	/deep/ .cell-line-item:nth-child(even) {
		width: 50%;
	}
</style>